<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>
<body>
	<script>
		var arr1 = [{
			title: '张父',
			name: 'zhangfu',
			children: [{
				title: '张子一',
				name: 'zhangziyi',
				children: [{
					title: '张孙一',
					name: 'zhangsunyi',
				}, {
					title: '张孙二',
					name: 'zhangsuner',
				}]
			}, {
				title: '张子二',
				name: 'zhangzier',
			}]
		}, {
			title: '李父',
			name: 'lifu',
			children: [{
				title: '李子一',
				name: 'liziyi',
				children: [{
					title: '李孙一',
					name: 'lisunyi',
				}, {
					title: '李孙二',
					name: 'lisuner',
				}]
			}, {
				title: '李子二',
				name: 'lizier',
			}]
		}, {
			title: '王父',
			name: 'wangfu',
			children: [{
				title: '王子一',
				name: 'wangziyi',
				children: [{
					title: '王孙一',
					name: 'wangsunyi',
				}, {
					title: '王孙二',
					name: 'wangsuner',
				}]
			}, {
				title: '王子二',
				name: 'wangzier',
			}]
		}]

		var arr2 = [{
			title: '张父',
			name: 'zhangfu',
			children: [{
				title: '张子二',
				name: 'zhangzier',
			}]
		}, {
			title: '李父',
			name: 'lifu',
			children: [{
				title: '李子一',
				name: 'liziyi',
				children: [{
					title: '李孙一',
					name: 'lisunyi',
				}, {
					title: '李孙二',
					name: 'lisuner',
				}]
			}, {
				title: '李子二',
				name: 'lizier',
			}]
		}, {
			title: '刘父',
			name: 'liufu'
		}]

		function gen(userRouter = [], allRouter = []) {
			let realRoutes = []
			allRouter.forEach((v, i) => {
				userRouter.forEach((item, index) => {
					if (item.name === v.name) {
						if (item.children && item.children.length > 0) {
		                    v.children = gen(item.children, v.children)
		                }
		                realRoutes.push(v)
					}
				})
			})
			return realRoutes
		}
	</script>
</body>
</html>